<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />
    <link rel="stylesheet" href="style.css">
    <title>Testimonial Box</title>
</head>
<body>
    <div class="testimonial-container">
        <div class="progress-bar"></div>
        <div class="fas fa-quote-right fa-quote"></div>
        <div class="fas fa-quote-left fa-quote"></div>
        <p class="testimonial">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident ipsam autem illo debitis quam? Reiciendis deserunt maiores provident esse cum libero quod? Libero maxime veritatis, nesciunt saepe quasi hic iure!
            Esse hic qui neque facere numquam, vel porro omnis nam velit nisi nemo quos deserunt ratione a modi autem veniam distinctio vitae sed temporibus quis. Atque non earum minima quo.
        </p>
        <div class="user">
            <img src="https://images.unsplash.com/photo-1438761681033-6461ffad8d80?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1500&q=80" alt="user" class="user-image">
            <div class="user-details">
                <h4 class="username">Teresa Smith</h4>
                <p class="role">Marketing</p>
            </div>
        </div>
    </div>
    <script src="script.js"></script>    
</body>
</html>



